import React from 'react';
import { Spin } from 'antd'
import styled from 'styled-components'
// 引入 prop-types 做参数类型校验
import Pts from 'prop-types'
// Loading 组件封装
const Loading = (props) => {
  return (
    <Main>
      <Spin size={'large'} spinning={props.spinning} tip={props.tip}></Spin>
    </Main>
  );
}

// 对 Spin 进行二次封装
// 01: 给该组件设置默认属性
Loading.defaultProps = {
  spinning: true,
  tip: '加载中...'
}

// 02: 参数类型校验
Loading.propTypes = {
  spinning: Pts.bool,
  tip: Pts.string
}

// 写样式
const Main = styled.div`
  height: 100%;
  display: flex;
  justify-content: center;
  align-items: center;
`

export default Loading;